<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html lang="zh-cmn-Hans">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<link rel="shortcut icon" href="<%=basePath%>static/logo.png">
	<link rel="stylesheet" href="<%=basePath%>static/css/iconfont.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/global.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/bootstrap.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/bootstrap-theme.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/swiper.min.css">
	<link rel="stylesheet" href="<%=basePath%>static/css/styles.css">
	<link rel="stylesheet" href="<%=basePath %>/static2/assets/layer/skin/layer.css">
	<script src="<%=basePath%>static/js/jquery.1.12.4.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/bootstrap.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/swiper.min.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/global.js" charset="UTF-8"></script>
	<script src="<%=basePath%>static/js/jquery.DJMask.2.1.1.js" charset="UTF-8"></script>
	<script src="<%=basePath %>/static2/assets/layer/layer.js" charset="UTF-8"></script>	
	<script type="text/javascript">
	//查询到所有的商品信息
	$(document).ready(function(){
    	var goodid='<%=request.getParameter("goodid")%>';
    	//alert(goodid);
    	var theme='<%=session.getAttribute("username")%>';
		 //alert(theme);
		 if(theme==null||theme=="null"){
			 $("#dengluzhuce").show(); 
			 $("#tuichudenglu").hide();
			 $("#xianshi").hide();
		 }else{
			 $("#dengluzhuce").hide();  
			 $("#tuichudenglu").show();
		 }

		
	});
	
	function member_add(){
		//提前检查一下数量，如果输入不合法或者输入量超过库存，就不能进行购买
		//alert("进入，开始判断");
		//正整数判断
		var number = $("#goumaishuliang").val();
		if(!(/(^[1-9]\d*$)/.test(number))){
		    alert("填写数量应为正整数");
		    return
		}
		//库存判断
		var stock = <%=(int)session.getAttribute("goodstock")%>;
		if(stock<number){
			alert("输入数量大于库存，请重新填写");
			return
		}
		//alert("layer以外");
		layer.confirm('确认加入购物车吗？',function(index){
			var goodid='<%=request.getParameter("goodid")%>';
			var number = $("#goumaishuliang").val();
			//alert("finded"+number);
			$.ajax({
				type:"POST",
				url:"../web/ShopCart",
				data:{goodid:goodid,number:number},
				//dataType:"json",
				success:function(data){
				}
			});
		layer.msg('已添加!',{icon:1,time:1000});
		});
	}
	</script>
	<base href="<%=basePath%>jsp/"/>
	
	<title>卓越图书网</title>
</head>
<body>
	<!-- 顶部tab -->
	<div class="tab-header">
		<div class="inner">
			<div class="pull-left">
				<div class="pull-left">嗨，欢迎来到<span class="cr">卓越图书网</span>
					<span id="xianshi">尊敬的<%out.println(session.getAttribute("username")); %></span>
				</div>
				
			</div>
			<div class="pull-right" id="dengluzhuce">
				<a href="<%=basePath%>jsp/login.jsp"><span class="cr">登录</span></a>
				<a href="<%=basePath%>jsp/login.jsp?p=register">注册</a>
			</div>
			<div class="pull-right" id="tuichudenglu">
			    <a href="<%=basePath%>jsp/udai_welcome.jsp"><span class="cr">个人中心</span></a>
				<a href="<%=basePath%>jsp/login.jsp"><span class="cr">退出登录</span></a>
			</div>
		</div>
	</div>
	<!-- 搜索栏 -->
	<div class="top-search">
		<div class="inner">
			<a class="logo" href="<%=basePath %>jsp/homePage.jsp"><img src="<%=basePath%>static/images/icons/logo.png" alt="卓越图书网" class="cover"></a>
			<div class="search-box">
				<form  action="../web/DimSearch"  class="input-group">
					<input name="goods_dimSearch" placeholder="Ta们都在搜卓越图书网" type="text">
					<span class="input-group-btn">
						<button type="submit">
							<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
						</button>
					</span>
				</form>
			</div>
			<div class="cart-box">
				<a href="<%=basePath%>web/SelectShopCart" class="cart-but">
					<i class="iconfont icon-shopcart cr fz16"></i> 
				</a>
			</div>
		</div>
	</div>
	<!-- 内页导航栏 -->
	<div class="top-nav bg3">
		<div class="nav-box inner">
			<div class="all-cat">
				<div class="title"><i class="iconfont icon-menu"></i> 全部分类</div>
			</div>
			<ul class="nva-list">
				<a href="homePage.jsp"><li>首页</li></a>
			</ul>
		</div>
	</div>
	<div class="content inner">
		<section class="item-show__div item-show__head clearfix">
			<div class="pull-left">
				<ol class="breadcrumb">
					<li><a href="homePage.jsp">首页</a></li>
					<li><a href="item_sale_page.jsp">爆款推荐</a></li>
					<li class="active">${good.goodsName}</li>
				</ol>
				<div class="item-pic__box" id="magnifier">
					<div class="small-box">
						<img class="cover" src="<%=basePath%>${good.goodsImg}" alt="${good.goodsName} ">
						<span class="hover"></span>
					</div>
					
					<div class="big-box"><img src="<%=basePath%>${good.goodsImg}" alt="${good.goodsName}"></div>
				</div>
				<script src="../static/js/jquery.magnifier.js"></script>
				<script>
					$(function () {
						$('#magnifier').magnifier();
					});
				</script>
				<div class="item-info__box">
					<div class="item-title">
						<div class="name ep2">${good.goodsName}</div>
					</div>
					<div class="item-price bgf5">
						<div class="price-box clearfix">
							<div class="price-panel pull-left">
								售价：<span class="price">￥${good.price} </span>
							</div>
						</div>
					</div>
					<ul class="item-ind-panel clearfix">
						<li class="item-ind-item">
							<span class="ind-label c9">累计销量</span>
							<span class="ind-count cr">1688</span>
						</li>
						
					</ul>
					<div class="item-key">
						
						<div class="item-amount clearfix bgf5">
							<div class="item-metatit">数量：</div>
							<div class="amount-box">
								
								<div class="cart-num__box">
									<input type="button" class="sub" value="-"/>
									<input type="text" class="val" id="goumaishuliang" value="1" >
									<input type="button" class="add" value="+"/>
									<input type="hidden" class="id" value="${good.goodsId }">
									<span style="margin-left: 10px;">库存 <b id="Stock">${good.goodsStock}</b> 件</span>
								</div>
								
								<script>
									$(function () {
										$('.amount-input').onlyReg({reg: /[^0-9]/g});
										var stock = parseInt($('#Stock').jsp());
										$('.amount-widget').on('click','.amount-but',function() {
											var num = parseInt($('.amount-input').val());
											if (!num) num = 0;
											if ($(this).hasClass('add')) {
												if (num > stock - 1){
													return DJMask.open({
													　　width:"300px",
													　　height:"100px",
													　　content:"您输入的数量超过库存上限"
												　　});
												}
												$('.amount-input').val(num + 1);
											} else if ($(this).hasClass('sub')) {
												if (num == 1){
													return DJMask.open({
													　　width:"300px",
													　　height:"100px",
													　　content:"您输入的数量有误"
												　　});
												}
												$('.amount-input').val(num - 1);
											}
										});
									});
								</script>
							</div>
						</div>
						<div class="item-action clearfix bgf5">
							<a href="javascript:;" rel="nofollow" data-addfastbuy="true" title="点击此按钮，到下一步确认购买信息。" role="button" class="item-action__buy">立即购买</a>
							<a id="addtoshopcart" onclick="member_add()" rel="nofollow" data-addfastbuy="true" role="button" class="item-action__basket">
								<i class="iconfont icon-shopcart"></i> 加入购物车
							</a>
							<input type="hidden" class="id" value="${good.goodsId }">
							<!-- <script>
							$(document).ready(function(){
								
								var $addInSc = $('.item-action__basket')
								$addInSc.on('click', function() {
									alert("sss");
										$.ajax({
											type:"GET",
											url:"ShopCart",
											data:{goodsId:""+$(this).siblings('.id').val()+""},
											dataType:"json",
											success:function(data){
												
												alert(data);
												
											}
										});
								});
							});
							</script> -->
						</div>
					</div>
				</div>
			</div>
			
		</section>
		<section class="item-show__div item-show__body posr clearfix">
			<div class="item-nav-tabs">
				<ul class="nav-tabs nav-pills clearfix" role="tablist" id="item-tabs">
					<li role="presentation" class="active"><a href="#detail" role="tab" data-toggle="tab" aria-controls="detail" aria-expanded="true">商品详情</a></li>

				</ul>
			</div>
			<div class="pull-left">
				<div class="tab-content">
					<div role="tabpanel" class="tab-pane fade in active" id="detail" aria-labelledby="detail-tab">
						<div class="item-detail__info clearfix">
							<div class="record">商品编号：1000</div>
							<div class="record">出版社：北京大学出版社</div>
							<div class="record">上架时间：<td><fmt:formatDate value="${good.createTime }" pattern="yyyy-MM-dd"/></td></div>
							<div class="record">毛重：1Kg</div>
							<div class="record">质量：好</div>
						</div>						
					</div>
					<div role="tabpanel" class="tab-pane fade in active" id="" aria-labelledby="detail-tab">
						
							<div class="record">介绍：从事文史研究的学人，不能缺少版本目录学这把钥匙。辛德勇教授从自己的藏书中，选编出一册清代经部书籍的书影，并对每一部书的版本信息做了说明。这些旧刻本古籍，与他的读书与研究密不可分。编选出版这部书影，既是与同道学人交流文史研究的基本观念和方法，也有助于清代版本学研究的走向深入，以揭示版刻特征变化背后的历史文化脉动。 德勇教授带你进入古书之门 一部清代学术研究经典的版本指南 探讨文史研究的基本观念与方法 揭示版刻特征变化背后的历史文化脉动 研究价值+欣赏价值，古籍版本图录的创新之作</div>
						
					</div>
					<div role="tabpanel" class="tab-pane fade" id="evaluate" aria-labelledby="evaluate-tab">
						<div class="evaluate-tabs bgf5">
							<ul class="nav-tabs nav-pills clearfix" role="tablist">
								<li role="presentation" class="active"><a href="#all" role="tab" data-toggle="tab" aria-controls="all" aria-expanded="true">全部评价 <span class="badge">1314</span></a></li>
								<li role="presentation"><a href="#good" role="tab" data-toggle="tab" aria-controls="good">好评 <span class="badge">1000</span></a></li>
								<li role="presentation"><a href="#normal" role="tab" data-toggle="tab" aria-controls="normal">中评 <span class="badge">314</span></a></li>
								<li role="presentation"><a href="#bad" role="tab" data-toggle="tab" aria-controls="bad">差评 <span class="badge">0</span></a></li>
							</ul>
						</div>

					</div>
				
			    </div>
				
			</div>
			
			<script>
				$(document).ready(function(){
					$('#descCate').smartFloat(0);
					$('.dc-idsItem').click(function() {
						$(this).addClass('selected').siblings().removeClass('selected');
					});
					$('#item-tabs a[data-toggle="tab"]').on('show.bs.tab', function (e) {
						$('#descCate #' + $(e.target).attr('aria-controls') + '-tab')
						.addClass('in').addClass('active').siblings()
						.removeClass('in').removeClass('active');
					});
				});
			</script>
		</section>
	</div>
	<!-- 右侧菜单 -->
	<div class="right-nav">
		<ul class="r-with-gotop">
			<li class="r-toolbar-item">
				<a href="udai_welcome.jsp" class="r-item-hd">
					<i class="iconfont icon-user" data-badge="0"></i>
					<div class="r-tip__box"><span class="r-tip-text">用户中心</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_shopcart.jsp" class="r-item-hd">
					<i class="iconfont icon-cart"></i>
					<div class="r-tip__box"><span class="r-tip-text">购物车</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="udai_collection.jsp" class="r-item-hd">
					<i class="iconfont icon-aixin"></i>
					<div class="r-tip__box"><span class="r-tip-text">我的收藏</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="" class="r-item-hd">
					<i class="iconfont icon-liaotian"></i>
					<div class="r-tip__box"><span class="r-tip-text">联系客服</span></div>
				</a>
			</li>
			<li class="r-toolbar-item">
				<a href="issues.jsp" class="r-item-hd">
					<i class="iconfont icon-liuyan"></i>
					<div class="r-tip__box"><span class="r-tip-text">留言反馈</span></div>
				</a>
			</li>
			<li class="r-toolbar-item to-top">
				<i class="iconfont icon-top"></i>
				<div class="r-tip__box"><span class="r-tip-text">返回顶部</span></div>
			</li>
		</ul>
		<script>
			$(document).ready(function(){ $('.to-top').toTop({position:false}) });
		</script>
	</div>
	<!-- 底部信息 -->
	<div class="footer">
		<div class="footer-tags">
					</div>
		<div class="copy-box clearfix">
			<!-- 版权 -->
			<!-- 版权 -->
			<p class="copyright">
				©卓越图书网 版权所有，并保留所有权利<br>
				河南省郑州市中原区科学大道100号
			</p>
		</div>
	</div>
</body>
